<template>
	<div class="box">
		<div class="title">
			<span class="tag"></span>
			上游报价
		</div>
		<div class="">
			<FormItems
				ref="form"
				v-model="formData.plan"
				:form="formList"
				:state="state"></FormItems>
		</div>
	</div>
</template>

<script>
	import FormItems from '@/views/finance/manage/formItems/index.vue';
	export default {
		components: { FormItems },
		props: {
			value: {
				required: false,
			},
			state: {
				required: false,
			},
			type: {
				type: String,
				required: false,
			},
		},
		data() {
			return {};
		},
		inject: ['_index', 'details_forecast', '_planDicts'],
		beforeDestroy() {
			if (this.notEmpty(this.details?.productList?.[this.index])) {
				this.$refs.form?.form_resetFields?.();
			}
		},
		computed: {
			planList() {
				return this._planDicts?.() ?? [];
			},
			details() {
				return this.details_forecast();
			},
			index() {
				return this._index();
			},
			formData: {
				get() {
					return this.value;
				},
				set(val) {
					this.$emit('input', val);
				},
			},
			formList() {
				return [
					{
						label: '供应商',
						placeholder: '请选择供应商',
						type: 'select',
						selectList: this?.planList?.supplierList ?? [],
						selectLabel: 'supplierName',
						selectValue: 'supplierId',
						prop: 'purchaseQuotationSupplierId',
						rules: [
							{
								required: true,
								message: '请选择供应商',
								trigger: 'change',
							},
						],
						event: {
							type: 'change',
							cb: row => {
								let item = this?.planList?.supplierList.find(
									e =>
										e.supplierId ==
										row.purchaseQuotationSupplierId,
								);
								if (item) {
									row.purchaseQuotationSupplierName =
										item.supplierName;
									row.purchaseQuotationSupplierCode =
										item.supplierCode;
								} else {
									row.purchaseQuotationSupplierName =
										undefined;
									row.purchaseQuotationSupplierCode =
										undefined;
								}
							},
						},
					},
					{
						label: '首付款',
						type: 'input_number',
						tag: 'price',
						prop: 'purchaseQuotationDownpayment',
						rules: [
							{
								required: true,
								message: '请输入首付款',
								trigger: 'blur',
							},
						],
						event: {
							type: 'blur',
							cb: () => {
								this.setPurchaseQuotationTotalCost();
							},
						},
					},
					{
						label: '保证金',
						type: 'input_number',
						tag: 'price',
						prop: 'purchaseQuotationCashdeposit',
						rules: [
							{
								required: true,
								message: '请输入保证金',
								trigger: 'blur',
							},
						],
					},
					{
						label: '留购价',
						type: 'input_number',
						tag: 'price',
						prop: 'purchaseQuotationRetained',
					},
					{
						label: '期满租金',
						type: 'input_number',
						tag: 'price',
						prop: 'purchaseQuotationRentExpiry',
						event: {
							type: 'blur',
							cb: () => {
								this.setPurchaseQuotationTotalCost();
							},
						},
					},
					{
						label: '租期',
						type: 'input_number',
						prop: 'purchaseQuotationTenancy',
						rules: [
							{
								required: true,
								message: '请输入租期',
								trigger: 'blur',
							},
						],
						event: {
							type: 'blur',
							cb: () => {
								this.setPurchaseQuotationTotalCost();
							},
						},
					},
					{
						label: '月租金',
						type: 'input_number',
						tag: 'price',
						prop: 'purchaseQuotationRent',
						rules: [
							{
								required: true,
								message: '请输入月租金',
								trigger: 'blur',
							},
						],
						event: {
							type: 'blur',
							cb: () => {
								this.setPurchaseQuotationTotalCost();
							},
						},
					},
					{
						label: '对外总成本',
						prop: 'purchaseQuotationTotalCost',
						type: 'input_number',
						tag: 'price',
						state: this.type == 'preview' ? 'readonly' : 'readonly',
					},
				];
			},
		},
		created() {},
		mounted() {},
		methods: {
			setPurchaseQuotationTotalCost() {
				let price = this.toNumberAdd(
					this.formData?.plan?.purchaseQuotationDownpayment,
					this.formData?.plan?.purchaseQuotationRentExpiry,
				);
				let everyPrice = this.toNumberRide(
					this.formData.plan.purchaseQuotationTenancy,
					this.formData.plan.purchaseQuotationRent,
				);
				let totalPrice = this.toNumberAdd(price, everyPrice);
				this.$set(
					this.formData.plan,
					'purchaseQuotationTotalCost',
					totalPrice,
				);
			},
			valid() {
				return new Promise(async resolve => {
					let result = true;
					let refs = Object.values(this.$refs);
					for (let index = 0; index < refs?.length; index++) {
						const ref = refs[index];
						if (
							Object.prototype.toString.call(ref) ==
							'[object Array]'
						) {
							for (let i = 0; i < ref.length; i++) {
								const element = ref[i];
								if (element?.valid) {
									let rc = await element?.valid?.();
									result = result && rc;
								}
								if (element?.validate) {
									let rf = await this._valid(ref);
									result = result && rf;
								}
								if (element?.form_validate) {
									let rf = await this._valid(
										ref,
										'form_validate',
									);
									result = result && rf;
								}
							}
						} else {
							if (ref?.valid) {
								let rc = await ref?.valid?.();
								result = result && rc;
							}
							if (ref?.validate) {
								let rf = await this._valid(ref);
								result = result && rf;
							}
							if (ref?.form_validate) {
								let rf = await this._valid(
									ref,
									'form_validate',
								);
								result = result && rf;
							}
						}
					}

					resolve(result);
				});
			},
		},
	};
</script>

<style lang="scss" scoped>
	.box {
		border-radius: 8px;
		background-color: #fff;
		.title {
			font-size: 14px;
			font-family: PingFangSC, PingFang SC;
			font-weight: 500;
			color: #333333;
			line-height: 22px;
			padding-bottom: 15px;
			// border-bottom: 1px solid #e9e9e9;
			display: flex;
			align-items: center;
			.tag {
				width: 8px;
				height: 8px;
				background-color: #1890ff;
				border-radius: 100%;
				margin-right: 10px;
			}
			.price {
				font-size: 14px;
				font-family: PingFangSC, PingFang SC;
				font-weight: 400;
				color: #1890ff;
				line-height: 20px;
				margin-left: 20px;
			}
		}
	}
	::v-deep .el-input-number {
		width: 100%;
		.el-input-number__decrease,
		.el-input-number__increase {
			display: none;
		}
		input {
			width: 100%;
			padding: 5px;
			text-align: left;
		}
	}
</style>
